<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html">

<h:head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link href="#{facesContext.externalContext.requestContextPath}/resources/css1/reset.css" media="screen" type="text/css" rel="stylesheet"/>
<link href="#{facesContext.externalContext.requestContextPath}/resources/css1/style.css" media="screen" type="text/css" rel="stylesheet"/>
<link href="#{facesContext.externalContext.requestContextPath}/resources/css1/grid_12.css" media="screen" type="text/css" rel="stylesheet"/>

<script src="#{facesContext.externalContext.requestContextPath}/resources/js/jquery-1.7.min.js"/>
<script src="#{facesContext.externalContext.requestContextPath}/resources/js/jquery.easing.1.3.js"/>
        <title>Employee Template</title>
    </h:head>

    <h:body>

        <div class="main">
            <header>
                <h1>
                    <a href="index.html">
                    <img alt="" src="#{facesContext.externalContext.requestContextPath}/resources/images1/logo.png"/>
                    </a>
                </h1>
                <div class="form-search">
                    <ui:insert name="fromsearch">from search</ui:insert>
                </div>
                <div class="clear"></div>
                <nav class="box-shadow">
                    <div>
                        <ul class="menu">
                            <li class="home-page">
                                <a href="index.html">
                                <span></span>
                                </a>
                            </li>
                            <li>
                                <a href="about.html">About Us</a>
                            </li>
                            <li>
                                <a href="about.html">Event</a>
                            </li>
                            <li>
                                <a href="about.html">User</a>
                            </li>
                            <li>
                                <a href="about.html">Contact</a>
                            </li>
                        </ul>
                        <div class="social-icons">
                            <span>Follow us:</span>
                            <a class="icon-3" href="#"></a>
                            <a class="icon-2" href="#"></a>
                            <a class="icon-1" href="#"></a>
                        </div>
                        <div class="clear"></div>
                    </div>
                </nav>
            </header>
            <section id="content">
                <div class="ic"></div>
                <div id="slide" class="box-shadow">
                    <div class="slider" style="overflow: hidden;">
                        <ul class="items">
                            <li style="display: none;">
                                <img alt="" src="#{facesContext.externalContext.requestContextPath}/resources/images1/slider-1.jpg"/>
                            </li>
                            <li style="display: none;">
                                <img alt="" src="#{facesContext.externalContext.requestContextPath}/resources/images1/slider-2.jpg"/>
                            </li>
                            <li style="display: none;">
                                <img alt="" src="#{facesContext.externalContext.requestContextPath}/resources/images1/slider-3.jpg"/>
                            </li>
                        </ul>
                        <div class="pic" style="overflow: hidden; width: 940px; height: 393px;overflow: hidden; width: 940px; height: 393px; background: url('#{facesContext.externalContext.requestContextPath}/resources/images1/slider-3.jpg') no-repeat scroll  0pt Opt transparent;">
                            <div class="mask" style="position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; z-index: 1;">
                                <div style="left: 0px; top: 0px; position: absolute; width: 940px; height: 393px; background-position: 0px 0px; background-image: url('#{facesContext.externalContext.requestContextPath}/resources/images1/slider-1.jpg'); opacity: 1; display: none;">
                                    
                                </div>
                            </div>
                        </div>
                        <ul class="pagination">
                            <li class="current">
                                <a href="#"></a>
                            </li>
                            <li class="">
                                <a href="#"></a>
                            </li>
                            <li class="">
                                <a href="#"></a>
                            </li>
                        </ul>
                        <div class="numStatus">
                            <span class="curr">2</span>
                            /
                            <span class="total">3</span>
                        </div>
                        <div class="banner" style="z-index: 999; left: auto; right: 0px;">We Craft Practical Solutions&nbsp;</div>
                    </div>
                </div>
                <div class="container_12">
                    <div class="grid_12">
                        <div class="pad-0 border-1">
                            <h2 class="top-1 p0">Welcome my web</h2>
                            <p class="p2">
                                <ui:insert name="remind birthday">remind birthday</ui:insert>
                            </p>
                        </div>
                        <div class="wrap block-1 pad-1">
                            <div><ui:insert name="event1">event1</ui:insert></div>
                            <div><ui:insert name="event1">event1</ui:insert></div>
                            <div class="last"><ui:insert name="event1">event1</ui:insert></div>
                        </div>
                    </div>
                    <div class="clear"></div>
                </div>
                <div class="aside">
                    <ui:insert name="content">content</ui:insert>
                </div>
            </section>
            <footer>
                Aptech Group 3 2012
            </footer>
        </div>

    </h:body>

</html>
